<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8">
    <title>乐看-招聘</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="format-detection" content="telephone=no">
    <link rel="stylesheet" href="/css/see/reset.min.css">
    <link rel="stylesheet" href="/plugins/swiper/swiper4.2.min.css">
    <link rel="stylesheet" href="/css/see/recruitPage.min.css?v=<%=$version%>">
</head>
<body>
<div id="recruitPage" v-cloak>
    <template>
        <see-header :number="3"></see-header>
    </template>
    <aside class="selfMediaPage-slide" id="selfMediaSlide1">
        <basic-slide :list="categoryCarouselList"></basic-slide>
    </aside>
    <div class="recruitPage-cent">
        <div class="selfMedia-tab">
            <span :class="{active:(indexs==1)}" @click="centTitleTab(1)">推荐</span>
            <strong></strong>
            <span :class="{active:(indexs==2)}" @click="centTitleTab(2)">圈子<small>{{totalRow}}</small></span>
            <div class="selfMedia-tabScreen" @click="getNext(1)"></div>
        </div>
        <template v-if="indexs==1">
            <div class="recruitPage-screen clearfix">
                <span @click="getIsScreen(1)">{{categoryName}}<i></i><strong></strong></span>
                <span @click="getIsScreen(2)">{{areaName}}<i></i><strong></strong></span>
                <span @click="getIsScreen(3)">{{salaryName}}<i></i><strong></strong></span>
                <span>高级筛选<i></i></span>
            </div>
            <div class="selfMedia-tabCent recruitPage-cent clearfix">
                <div class="recruitPage-list" v-for="item in recruitList2" @click.stop="getNext(2,item.recruitId)">
                    <span class="list-leftImg" :style="bgimg(item.coverImgSrc)"></span>
                    <span class="list-leftIcon"></span>
                    <h6>{{item.title}}</h6>
                    <p>{{item.areaName}}<span></span>{{item.experienceName}}<span></span>{{item.educationName}}</p>
                    <p class="list-centName">{{item.name}}</p>
                    <span class="list-rightTop">{{item.salaryName}}</span>
                    <span class="list-rightImg" :style="bgimg(item.headImg)" @click.stop="getNext(3,item.enterpriseId)"></span>
                </div>
            </div>
        </template>
        <template v-if="indexs==2">
            <div class="selfMediaPage-circle">
                <div class="circle-title clearfix">
                    <span :class="{active:sortId=='user_count'}" @click="circleTab(0)">最新创建</span>
                    <i></i>
                    <span :class="{active:sortId=='create_date'}" @click="circleTab(1)">成员较多</span>
                    <strong class="circle-found" @click="getNext(4)">创建我的圈子</strong>
                </div>
                <div class="selfMedia-tabCent circle-cent clearfix">
                    <div class="selfMedia-list circle-centList" v-for="item in circlesList2">
                        <div class="circle-img" @click="getUser(1,item)">
                            <img :data-original="item.coverImgSrc" class="lazy">
                            <span><strong>{{item.userCount}}</strong>人</span>
                            <div class="circle-imgShadow"></div>
                        </div>
                        <h6>{{item.name}}</h6>
                        <p @click="getUser(2,item)"><span :style="bgimg(item.headImg)"></span>{{item.uName}}</p>
                    </div>
                </div>
            </div>
        </template>
    </div>
    <div id="mask" @click="getIsScreen()" :class="{'maskShow':isScreen}"></div>
    <div id="screen" :class="{'maskShow':isScreen}">
        <template v-if="isScreen==1">
            <div class="screen-title">选择职位类别</div>
            <div class="position-category clearfix">
                <div class="chooseCity-province">
                    <span v-for="item in initData.recruitIndustrys" :class="{active:item.parentId==initId1}" @click="recruitCategorys(item.parentId,1)">{{item.name}}</span>
                </div>
                <div class="chooseCity-city">
                    <span v-for="item in rCategorys" :class="{active:item.id==initId2}" @click="recruitCategorys(item.id,2)">{{item.name}}</span>
                </div>
                <div class="chooseCity-area">
                    <span v-for="item in rCategorys1" :class="{active:item.id==categoryId1}" @click="getClass(1,item)">{{item.name}}</span>
                </div>
            </div>
        </template>
        <template v-if="isScreen==2">
            <city-Choice :message="message" @choice="choiceList" @close="getIsScreen()"></city-Choice>
            <!--<div class="screen-title">工作地点</div>-->
            <!--<div class="chooseCity-cent">-->
                <!--<div class="chooseCity-province">-->
                    <!--<span v-for="item in chinaList.provinces" :class="{active:item.code==provinceId}" @click="getCity(item.code)">{{item.name}}</span>-->
                <!--</div>-->
                <!--<div class="chooseCity-city">-->
                    <!--<span v-for="item in citiesList" :class="{active:item.code==cityId}" @click="getAreas(item.code)">{{item.name}}</span>-->
                <!--</div>-->
                <!--<div class="chooseCity-area">-->
                    <!--<span v-for="item in areasList">{{item.name}}</span>-->
                <!--</div>-->
            <!--</div>-->
        </template>
        <template v-if="isScreen==3">
            <div class="screen-title">薪资(元)</div>
            <div class="salary-cent">
                <!--<strong :class="{active:item.id==salaryId}"  @click="getClass(2)">不限</strong>-->
                <span v-for="item in salaryList" :class="{active:item.id==salaryId}" @click="getClass(2,item)">{{item.value}}</span>
            </div>
        </template>
        <div class="screen-cent"></div>

    </div>
    <footer-view :number="1"></footer-view>
    <prompt-view ref="prompt"></prompt-view>
</div>
<script src='/plugins/js/jquery-1.11.3.min.js'></script>
<script type="text/javascript" src="/plugins/js/jquery.lazyload.min.js"></script>
<script type="text/javascript" src="/plugins/swiper/swiper.min.4.2.js"></script>
<!--<script type="text/javascript" src="/plugins/js/jquery.masonry.min.js"></script>-->
<script type="text/javascript" src="/plugins/js/minigrid.js"></script>
<script type="text/javascript" src="/plugins/js/vue.min.js"></script>
<script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.6&key=589381d73924ac781b542765046f3235"></script>
<script type="text/javascript" src="/js/see/remogeo.js"></script>
<script type="text/javascript" src="/js/see/recruitPage.js?v=<%=$version%>"></script>
<script>
    var swiper1 = new Swiper("#selfMediaSlide1 .swiper-container",{
        spaceBetween: 30,
        centeredSlides: true,
        autoplay: {
            delay: 1500,
            disableOnInteraction: false
        },
        pagination: {
            el: '.swiper-pagination',
            clickable: true
        },
        lazy: {
            loadPrevNext: true,
            loadPrevNextAmount: 2
        },
        observer: true,//修改swiper自己或子元素时，自动初始化swiper
        observeParents: true//修改swiper的父元素时，自动初始化swiper
    });
    $("img.lazy").lazyload();
</script>
</body>
</html>